<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
	<meta http-equiv="content-type" content="text/html; charset=euc-kr" />
	<title>suggest</title>
	<script type="text/javascript" src="../js/httpRequest.js"></script>
	<script type="text/javascript">
	var checkFirst = false;
	var lastKeyword = '';
	var loopSendKeyword = false;
	
	function startSuggest() {
		if (checkFirst == false) {
			setTimeout("sendKeyword();", 500);
			loopSendKeyword = true;
		}
		checkFirst = true;
	}
	function sendKeyword() {
		if (loopSendKeyword == false) return;
		
		var keyword = document.search.keyword.value;
		if (keyword == '') {
			lastKeyword = '';
			hide('suggest');
		} else if (keyword != lastKeyword) {
			lastKeyword = keyword;
			
			if (keyword != '') {
				var params = "keyword="+encodeURIComponent(keyword);
				sendRequest("suggest.jsp", params, displayResult, 'POST');
			} else {
				hide('suggest');
			}
		}
		setTimeout("sendKeyword();", 500);
	}
	function displayResult() {
		if (httpRequest.readyState == 4) {
			if (httpRequest.status == 200) {
				var resultText = httpRequest.responseText;
				var result = resultText.split('|');
				var count = parseInt(result[0]);
				var keywordList = null;
				if (count > 0) {
					keywordList = result[1].split(',');
					var html = '';
					for (var i = 0 ; i < keywordList.length ; i++) {
						html += "<a href=\"javascript:select('"+
						        keywordList[i]+"')\">"+
						        keywordList[i]+"</a><br/>";
					}
					var listView = document.getElementById('suggestList');
					listView.innerHTML = html;
					
					show('suggest');
				} else {
					hide('suggest');
				}
			} else {
				alert("httpRequest Status 는 : "+httpRequest.status);
			}
		}
	}
	function select(selectedKeyword) {
		document.search.keyword.value = selectedKeyword;
		loopSendKeyword = false;
		checkFirst = false;
		hide('suggest');
	}
	function show(elementId) {
		var element = document.getElementById(elementId);
		if (element) {
			element.style.display = '';
		}
	}
	function hide(elementId) {
		var element = document.getElementById(elementId);
		if (element) {
			element.style.display = 'none';
		}
	}
	</script>
	<style>
	#view {
		border: 1px solid #999;
	}
	</style>
</head>
<body>
<form name="search">
<input type="text" name="keyword" id="keyword" onkeydown="startSuggest()" />
<input type="button" value="search" />
<div id="suggest" style="display:; postion: absolute; left: 0px; top: 30px;">
	<div id="suggestList"></div>
</div>

</form>

</body>
</html>